<template>
    <view class="container">
      <!-- 顶部标题 -->
      <view class="header">
        <text class="title">发布模板</text>
      </view>
      
      <!-- 模板列表 -->
      <view class="template-list">
        <view class="template-item" v-for="(item, index) in templates" :key="index" @tap="selectTemplate(item)">
          <view class="template-content">
            <text class="template-name">{{ item.name }}</text>
            <text class="template-desc">{{ item.description }}</text>
          </view>
          <view class="template-arrow">></view>
        </view>
      </view>
    </view>
  </template>
  
  <script>
  export default {
    data() {
      return {
        templates: [
          {
            name: '模板一',
            description: '适用于日常记录'
          },
          {
            name: '模板二',
            description: '适用于运动记录'
          },
          {
            name: '模板三',
            description: '适用于工作记录'
          }
        ]
      }
    },
    methods: {
      selectTemplate(template) {
       uni.navigateTo({
        url: `/pages/template/tmp${this.templates.indexOf(template) + 1}`
       })
      }
    }
  }
  </script>
  
  <style lang="scss" scoped>
  .container {
    min-height: 100vh;
    background-color: #000;
    padding: 20rpx;
    
    .header {
      padding: 20rpx 0;
      .title {
        color: #fff;
        font-size: 36rpx;
        font-weight: bold;
      }
    }
    
    .template-list {
      margin-top: 40rpx;
      
      .template-item {
        background: rgba(255,255,255,0.1);
        border-radius: 16rpx;
        padding: 30rpx;
        margin-bottom: 20rpx;
        display: flex;
        justify-content: space-between;
        align-items: center;
        
        .template-content {
          .template-name {
            color: #fff;
            font-size: 32rpx;
            margin-bottom: 10rpx;
            display: block;
          }
          
          .template-desc {
            color: rgba(255,255,255,0.6);
            font-size: 24rpx;
          }
        }
        
        .template-arrow {
          color: rgba(255,255,255,0.6);
          font-size: 32rpx;
        }
      }
    }
  }
  </style>